<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>iPhone</title>
		<link rel="stylesheet" type="text/css" href="css/cube.css"/>
		<link rel="stylesheet" type="text/css" href="css/iconfont.css"/>
		<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
		<link rel="stylesheet" type="text/css" href="css/style.css"/>
		<link rel="stylesheet" type="text/css" href="css/common.css"/>
		
		<script src="js/jquery-1.12.4.min.js" type="text/javascript"></script>
		<script src="js/init.js" type="text/javascript"></script>
		<script src="js/bootstrap.min.js" type="text/javascript"></script>
	</head>
	<body>
<!--	nav-->
	<nav class="navbar navbar-inverse">
  		<div class="container">
  		  <ul class="head">
  			<li><a href="index.html"><span class="iconfont">&#xe602;</span></a></li>
  			<li><a href="mac.html">Mac</a></li>
  			<li><a href="iPad.html">iPad</a></li>
  			<li><a href="#" style="opacity:0.65;">iPhone</a></li>
  			<li><a href="watch.html">Watch</a></li>
  			<li><a href="music.html">Music</a></li>
  			<li><a href="#">技术支持</a></li>
  			<li><a href="#"><span class="iconfont">&#xe601;</span></a></li>
  			<li id="gou"><a href="#"><span class="iconfont">&#xe60c;</span></a></li>
  		  </ul>
  		</div>
	</nav>
	
<!--head-->
	<header style="background:#141414;">
		<div class="shopping">
			<div class="sanjiao"></div>
			<p>你的购物袋是空的</p>
			<ul>
				<li><a href="#"><img src="images/bag.svg"/ style="margin-right:10px;">购物袋</a></li>
				<li><a href="#"><img src="images/favorites.svg"/ style="margin-right:10px;">收藏</a></li>
				<li><a href="#"><img src="images/orders.svg"/ style="margin-right:10px;">订单</a></li>
				<li><a href="#"><img src="images/account.svg"/ style="margin-right:10px;">账户</a></li>
				<li><a href="#"><img src="images/signIn.svg"/ style="margin-right:10px;">登录</a></li>
			</ul>
		</div>
		<div class="container mini">
		<ul class="picture">
			<li><a href="#"><img src="images/iphone7.svg"/><br/>
				<span style="color:#fff;">iPhone 8</span><br><span style="color:#6bf;">新款</span></a></li>
			<li><a href="#"><img src="images/iphone6s.svg"/><br/>
				<span style="color:#fff;">iPhone 6s</span></a></li>
			<li><a href="#"><img src="images/iphonese.svg"/><br/>
				<span style="color:#fff;">iPhone SE</span></a></li>
			<li><a href="#"><img src="images/iphone.svg"/><br/>
				<span style="color:#fff;">iOS 10</span></a></li>
			<li><a href="#"><img src="images/iphone_acc.svg"/><br/>
				<span style="color:#fff;">配件</span></a></li>
			<li><a href="#"><img src="images/iphone_comp.svg"/><br/>
				<span style="color:#fff;">机型比较</span></a></li>
		</ul>
		</div>
	</header>
<!--主体-->
	<div class="iphone7-body">
		<div class="hero">
			<h2>iPhone</h2>
			<h1>7，在此。</h1>
			<p><a href="#">进一步了解&nbsp;&gt;</a><a href="#">购买&nbsp;&gt;</a></p>
			<span>或立即到&nbsp;<a href="#" style="font-size:17px;">Apple&nbsp;Store</a>&nbsp;零售店购买</span>
		</div>
		<img src="images/hero.jpg"/>
	</div>
<!--第一张图-->
	<div class="container-fluid iPhone7-page1">
		<div class="row">
			<div class="col-lg-6 iPhone7-items1">
				<h2>AirPods</h2>
				<h1>无线，无繁琐，只有妙不可言。</h1>
				<p><a href="#" style="color:#0070c9;">进一步了解&nbsp;</a>&gt;</p>
				<img src="images/airpods_large.jpg"/>
			</div>
			<div class="col-lg-6 iPhone7-items1" style="background:#121212;margin:0 0 0 25px">
				<h2 style="color:#ccc;">配件</h2>
				<h1 style="color:#fff;">百般搭配，一样惹人注目。</h1>
				<p style="color:#6bf;"><a href="#" style="color:#6bf;">选购&nbsp;iPhone&nbsp;配件&nbsp;</a>&gt;</p>
				<img class="img-responsive" src="images/accessories_large.jpg"/>
			</div>
		</div>
	</div>
<!--第二张图-->
	<div class="iPhone7-page2">
		<h1>iPhone 机型比较</h1>
		<p><a href="#" style="color:#0070c9;">找到适合你的&nbsp;iPhone&nbsp;</a>&gt;</p>
		<div class="container">
			<ul>
				<li><a href="#"><img src="images/compare_iphone_7p.jpg"/>
					<p>iPhone7 Plus</p></a></li>
				<li><a href="#"><img src="images/compare_iphone_7.jpg"/>
					<p>iPhone7</p></a></li>
				<li><a href="#"><img src="images/compare_iphone_6sp.jpg"/>
					<p>iPhone6s Plus</p></a></li>
				<li><a href="#"><img src="images/compare_iphone_6s.jpg"/>
					<p>iPhone6s</p></a></li>
				<li><a href="#"><img src="images/compare_iphonese.jpg"/>
					<p>iPhone SE</p></a></li>
			</ul>
		</div>
	</div>
<!--第三张图-->
	<div class="container-fluid iPhone7-page1">
		<div class="row">
			<div class="col-lg-6 iPhone7-items1">
				<h3>加入 iPhone<br>年年焕新计划。</h3>
				<img class="iphone_up" src="images/iphone_up.jpg"/>
				<ul class="upgrade">
					<li><span class="glyphicon glyphicon-ok-circle"></span>&nbsp;每年升级换购新 iPhone1</li>
					<li><span class="glyphicon glyphicon-ok-circle"></span>&nbsp;无需合约，可选择运营商</li>
					<li><span class="glyphicon glyphicon-ok-circle"></span>&nbsp;全额支付或分期付款2</li>
					<li><span class="glyphicon glyphicon-ok-circle"></span>&nbsp;AppleCare+ 全方位服务计划为 iPhone 提供保护</li>
					<li style="color:#0070c9;"><a href="#" style="color:#0070c9;">了解详情&nbsp;</a>&gt;</li>
				</ul>
			</div>
			<div class="col-lg-6 iphone_tr">
				<h3>以旧换新，<br>入手新 iPhone。</h3>
				<h2>以你符合条件的智能手机来换购新<br>iPhone，享受最高可达 RMB 2,235 的折抵<br>优惠。</h2>
				<p style="color:#0070c9;"><a href="#" style="color:#0070c9;">进一步了解&nbsp;</a>&gt;</p>
				<img src="images/iphone_tr.jpg"/>
			</div>
		</div>
	</div>
<!--第四张图-->
	<div class="pickup" style="background:#f2f2f2;">
		<div class="container">
			<div class="row">
				<div class="col-lg-6">
					<img src="images/pickup.png"/>
					<h3>前往零售店</h3>
					<p>到 Apple Store 零售店亲身体验各种 Apple 产品，<br/>我们还将为你解答相关问题。</p>
					<span><a href="#">进一步了解&nbsp;&gt;</a></span>
				</div>
				<div class="col-lg-6">
					<img src="images/shipping.png"/>
					<h3>免费送货</h3>
					<p>享受免费送货上门服务。</p>
					<span><a href="#">进一步了解&nbsp;&gt;</a></span>
				</div>
			</div>
		</div>
	</div>
<!--第五张图-->
	<div class="how">
		<div class="container">
			<div class="row">
				<div class="col-lg-6 understant">
					<h1>如何购买 iPhone</h1>
					<p style="float:left;"><a href="#" style="color: #0070c9;">进一步了解&nbsp;</a>&gt;</p>
				</div>
				<div class="col-lg-6 understant">
					<h1 style="text-align:right;">转移到 iPhone</h1>
					<p style="float:right;margin-right:66px;"><a href="#" style="color: #0070c9;">进一步了解&nbsp;</a>&gt;</p>
				</div>
			</div>
		</div>
	</div>
<!--第六张图-->
	<div class="pay">
		<div class="container">
			<div class="row">
				<div class="col-lg-6">
					<img src="images/appl.jpg"/>
				</div>
				<div class="col-lg-6 apple_pay">
					<img src="images/apple_pay.png"/>
					<h2>有了 Apple Pay，轻轻一触*，你就可以使用<br>iPhone 在全国数千家商店及众多 app 内安全、<br>简单地进行支付。</h2>
					<p><a href="#" style="color:#0070c9;">进一步了解&nbsp;</a>&gt;</p>
				</div>
			</div>
		</div>
	</div>
<!--第七张图-->
	<div class="buinese">
		<img src="images/business1.jpg"/>
		<div class="realize">
			<h1>iPhone 商务应用</h1>
			<p><a href="#" style="color:#6bf;">了解 iPhone 商务应用</a>&nbsp;&gt;</p>
			<p><a href="#" style="color:#6bf;">商务选购</a>&nbsp;&gt;</p>
		</div>
	</div>

<!--footer-->
<footer>
	<div class="container buy">
		<p>1. 只有符合 Apple 指定条件的 iPhone 才可参与本计划。<br>
		   2. 欲参与该计划的顾客需符合相应的资格条件，还需持有由合作银行发行的中国银联信用卡。需支付利率。须遵守完整条款。<br>
		   *完成支付可能需要输入密码，详情请洽发卡银行。<br>
		         双镜头摄像头仅于 iPhone 7 Plus 提供。亮黑色外观仅于 128GB 及以上存储容量的机型提供。<br>
		       产品图像仅供参考，请以实际销售实物为准。
		</p>
		<div class="row">
			<h4 class="iconfont" style="padding-left:15px;">&#xe602;&nbsp;&gt;&nbsp;iPhone</h4>
			<div class="col-lg-2">
				<h3>选购及了解</h3>
				<ul>
					<li><a href="#">Mac</a></li>
					<li><a href="#">iPad</a></li>
					<li><a href="#">iPhone</a></li>
					<li><a href="#">Watch</a></li>
					<li><a href="#">Music</a></li>
					<li><a href="#">iTunes</a></li>
					<li><a href="#">iPod</a></li>
					<li><a href="#">配件</a></li>
					<li><a href="#">APP&nbsp;Store充值卡</a></li>
				</ul>
			</div>
			<div class="col-lg-3" style="padding-left:30px;">
				<h3>Apple Store 商店</h3>
				<ul>
					<li><a href="#">查找零售店</a></li>
					<li><a href="#">Genius Bar 天才吧</a></li>
					<li><a href="#">讲座和学习</a></li>
					<li><a href="#">青少年活动</a></li>
					<li><a href="#">Apple Store App</a></li>
					<li><a href="#">翻新和优惠</a></li>
					<li><a href="#">分期付款</a></li>
					<li><a href="#">重复使用和循环利用</a></li>
					<li><a href="#">订单状态</a></li>
					<li><a href="#">选购帮助</a></li>
				</ul>
			</div>
			<div class="col-lg-2">
				<h3>教育与应用</h3>
				<ul>
					<li><a href="#">Apple 与教育</a></li>
					<li><a href="#">高校师生选购</a></li>
				</ul>
				<h3>商务应用</h3>
				<ul>
					<li><a href="#">Apple 与商务</a></li>
					<li><a href="#">商务选购</a></li>
				</ul>
			</div>
			<div class="col-lg-2">
				<h3>账户</h3>
				<ul>
					<li><a href="#">管理你的Apple ID</a></li>
					<li><a href="#">Apple store账户</a></li>
					<li><a href="#">iCloud.com</a></li>
				</ul>
				<h3>Apple 价值观</h3>
				<ul>
					<li><a href="#">辅助功能</a></li>
					<li><a href="#">环境责任</a></li>
					<li><a href="#">隐私</a></li>
					<li><a href="#">供应商责任</a></li>
				</ul>
			</div>
			<div class="col-lg-2">
				<h3>关于Apple</h3>
				<ul>
					<li><a href="#">Apple资讯</a></li>
					<li><a href="#">工作机会</a></li>
					<li><a href="#">媒体资讯</a></li>
					<li><a href="#">活动</a></li>
					<li><a href="#">联系Apple</a></li>
				</ul>
			</div>	
		</div>
		<p>更多选购方式：前往<a href="#"> Apple Store</a> 零售店，致电 400-666-8800 或查找在你附近的<a href="#">授权经销商</a>。</p>
		<div class="privice" style="margin-bottom:25px;">
			<span style="color:#888;margin-right:30px;">Copyright © 2017 Apple Inc. 保留所有权利。</span>
			<a href="#">隐私政策</a>
			<a href="#">使用条款</a>
			<a href="#">销售政策</a>
			<a href="#">法律信息</a>
			<a href="#">网站地图</a>
			<span style="float:right;"><a href="#" style="border:0;padding:0;margin:0;"><img src="images/16.png"/>&nbsp;中国</a></span>
		</div>
	</div>
</footer>
	<!-- <div type="button" style="position:fixed;right:0;bottom:0;">
		<a href="#top" style="text-decoration: none;">返回顶部</a>
	</div> -->
	<script src="js/text.js" type="text/javascript"></script>
	</body>
</html>
